import React from 'react'
import { Breadcrumb, Layout, theme } from 'antd';
import MySider from './MySider';
import { Outlet } from 'react-router-dom';

export default function index() {
    const { Content } = Layout;
    const {
        token: { colorBgContainer },
    } = theme.useToken();
    return (
        <Content
            style={{
                padding: '0 50px',
            }}
        >
            <Breadcrumb
                style={{
                    margin: '16px 0',
                }}
            >
                <Breadcrumb.Item>Home</Breadcrumb.Item>
                <Breadcrumb.Item>List</Breadcrumb.Item>
                <Breadcrumb.Item>App</Breadcrumb.Item>
            </Breadcrumb>
            <Layout
                style={{
                    padding: '24px 0',
                    background: colorBgContainer,
                }}
            >
                <MySider></MySider>
                <Content
                    style={{
                        padding: '0 24px',
                        minHeight: 280,
                    }}
                >
                   <Outlet></Outlet>
                </Content>
            </Layout>
        </Content>
    );
}
